import React, {FunctionComponent} from 'react';
import {Form} from "antd";
import * as API from '@/services';
import {DEFAULT_FORM_FLEX_LAYOUT, KfBizQuickFormProps, KfFloatingContextProps, KfInput, KfQuickForm} from "kf-web-library";

const FormItem = Form.Item;
type QueryEntity = API.MaterialGroup;
type CreateEntity = API.MaterialGroup_Create;
type ModifyEntity = API.MaterialGroup_Modify;

type DataFormProps = {
    type: string,
} & KfBizQuickFormProps & KfFloatingContextProps;


const GroupQuickForm: FunctionComponent<DataFormProps> = (props) => {

    const {formType, bizId, type, ...rest} = props;

    return (
        <KfQuickForm
            formType={formType}
            formProps={{
                ...DEFAULT_FORM_FLEX_LAYOUT
            }}
            defaultQueryRequest={() => API.queryMaterialGroup(bizId!).then(resp => {
                if (resp.flag) {
                    resp.data = {
                        ...resp.data,
                    }
                }
                return new Promise((resolve) => resolve(resp))
            })}
            submitRequest={{
                "create": (formValues) => API.createMaterialGroup({...formValues, type} as CreateEntity),
                "modify": (formValues, queryResult) => API.modifyMaterialGroup({...formValues, id: bizId, seq: queryResult.seq, type} as ModifyEntity)
            }}
            {...rest}
        >
            <FormItem name={nameof<ModifyEntity>((x) => x.name)} label="分组名称" rules={[{required: true, max: 20}]}>
                <KfInput/>
            </FormItem>

        </KfQuickForm>
    );
};

export default GroupQuickForm;
